//构建用于储存时间的变量
var date;
var hours;
var minutes;

//body背景色（适用于调用body背景色进行状态栏、菜单栏自适应的浏览器）
var LightBodyBG = 'rgb(235,230,225)';
var DarkBodyBG = 'rgb(40,45,50)'

//获取sessionStorage
//获取设备是否启用夜间模式
var Mode;
sessionStorage.getItem("isLight") ? (Mode = sessionStorage.getItem("isLight")) : (Mode = "none");

//博客切换日间/夜间模式
var ModeSwitch = new Vue({
    el: "#darkMode",
    //初始化日间/夜间模式状态
    data:{
        isLight:true,
    },
    //页面初始化切换
    created() {
        this.matchMedia(),
        //初始化Body背景色
        this.BodyBG(),
        //初始化轮播图
        this.Scroll()
    },
    
    methods: {
        //更改Body背景色的函数
        BodyBG:function(){
            this.isLight ? ($('body').css('background', LightBodyBG)) : ($('body').css('background', DarkBodyBG));
        },

        //初始化轮播图位置的函数
        Scroll:function(){
            var scrollclass = '';
            document.getElementById('scrollbox')?
            [
                scrollclass = document.getElementById('scrollbox'),
                this.isLight ? scrollclass.style.left = '0' : scrollclass.style.left = '-100%',
            ]:'';
            
        },
 
        //获取设备夜间模式状态
        matchMedia:function(){
            var Prefers_color = window.matchMedia && window.matchMedia('(prefers-color-scheme:light)').matches;
            (Mode == "none") ? [
                (Prefers_color) ? (this.isLight = true) : (this.isLight = false),
            ] : [
                (Mode == "Light") ? (this.isLight = true) : (this.isLight = false),
            ];
        },

        //手动切换模式
        modeSwitch:function(){
            this.isLight = !this.isLight;
            sessionStorage.setItem("isLight", this.isLight ? "Light" : "Dark" );
            Mode = sessionStorage.getItem("isLight");
            $('#darkMode').hasClass('Light') ?
                [
                    $('#scrollbox').stop().animate({ left: '-100%' }, time),
                ] :
                [
                    $('#scrollbox').stop().animate({ left: '0' }, time),
                ]
        },
    },
    //自动切换模式
    mounted () {
        //每100ms执行一次时间判断
        setInterval(() => {
            this.matchMedia();
            this.BodyBG();
            this.Scroll();
        }, 100);
    }
})
